import styled from "styled-components";
const AttributeWrapper = styled.div`
  .ant-switch-handle {
    &::before {
      width: 17px;
    }
  }
  .ant-switch {
    background: rgba(0, 0, 0, 0.25);
  }

  .ant-switch.ant-switch-checked {
    background: #4096ff;
  }
  .close-tag {
    svg {
      font-size: 14px;
    }
  }

  .attribute {
    display: flex;
    align-items: center;
    //background: #e7e7e7;
    margin: 15px 0;
    //border-bottom: 1px solid #cccccc;
    //&:nth-child(even) {
    //  background: #e7e7e7;
    //}
    /* box-shadow: 1px 1px rgba(0, 0, 0, 0.3); */
    padding: 10px 0;
    min-height: 50px;

    /* div {
      min-width: 70px;
      text-align: center;
    } */
    ul {
      display: flex;
      flex-wrap: wrap;
      padding-left: 10px;
      li {
        em {
          display: inline-block;
          cursor: pointer;
          padding: 5px;
          &:hover {
            color: var(--primary-color);
          }
        }
      }
    }
  }
`;

export default AttributeWrapper;
